const san = require('san/san.js')
const WebUploader = require('/js-modules/common/webuploader.js')
const {Upload} = require('api/goods')
const { tipAnimation } = require('commonFun')

const SanUploader = san.defineComponent({
    template: `
        <div class="s-upload">
            <div class="sanUpload" s-ref="upload">
                <i class="iconfont add">&#xe733;</i>
                <span class="s-upload-txt">上传</span>
            </div>
        </div>
    `,
    attached() {
        let upload = this.ref('upload')
        upload && upload.setAttribute('id', this.data.get('upId'))
        this.newUploader()
    },
    removeFile(file) {
        this.uploader && this.uploader.removeFile(file, true)
        this.uploader && this.uploader.getFiles('inited')
        return 
    },
    newUploader() {
        const maxImgs = parseInt(this.data.get('maxImgs') || 10)
        const singleSize = parseInt((this.data.get('singleSize') || 20)) * 1024 * 1024
        this.nextTick(() => {
            this.uploader = WebUploader.create({
                auto: true,
                swf: '/js-modules/common/Uploader.swf',
                server: window.ENV === 'development' ? 'http://39.108.74.124:8111/app/mock/30/upload' : Upload.url,
                fileNumLimit: maxImgs,
                fileSingleSizeLimit: singleSize,
                accept: {
                    title: 'Images', 
                    extensions: 'jpg,jpeg,png',
                    mimeTypes: 'image/jpg,image/jpeg,image/png'
                },
                pick: '#' + (this.data.get('upId')),
            })
            this.uploader.on('beforeFileQueued', file => {
                let fileLen = this.uploader.getFiles('inited').length // 此次已上传的图数
                const stat = (this.data.get('files') || []).length
                const maxImgs = this.data.get('maxImgs') || 10
                if (stat + fileLen + 1 - maxImgs > 0) {
                    this.uploader.removeFile(file, true)
                    tipAnimation(`最多只能上传${maxImgs}张图片`, '.container-wrap', '', 1200)
                    return false
                }
            })
            this.uploader.on('fileQueued', file => {
                this.uploader.makeThumb( file, ( error, src ) => {
                    if ( error ) {
                        return tipAnimation('无法预览'+error, document.body)
                    }
                }, 196, 196 )
            })
            this.uploader.on('uploadSuccess', (file, ret) => {
                if (0 === ret.code) {
                    file.src = ret.data[0]
                    this.data.push('files', file)
                } else {
                    tipAnimation(ret.msg || '上传图片失败', document.body, '', 1200)
                }
            })
            this.uploader.on('error', err => {
                if (err === 'Q_EXCEED_SIZE_LIMIT') {
                    // tipAnimation('图片大小超过限制(20MB)', '.container-wrap', '', 1200)
                } else if (err === 'F_DUPLICATE') {
                    tipAnimation('请勿重复上传图片', '.container-wrap', '', 1200)
                } else if (err === 'F_EXCEED_SIZE') {
                    tipAnimation('图片大小超过限制(20MB)', '.container-wrap', '', 1200)
                } else if (err === 'Q_TYPE_DENIED') {
                    tipAnimation('图片格式不对，图片仅支持JPG、PNG、JPEG格式', '.container-wrap', '', 1200)
                } else if (err === 'Q_EXCEED_NUM_LIMIT') {
                    tipAnimation('最多可上传10张图片', '.container-wrap', '', 1200)
                }
            })
            this.uploader.on( 'uploadError', (file, ret) => {
                tipAnimation(ret.msg || '上传图片失败', '.container-wrap')
                this.data.set('form.wxqr', '', {force: true})
            })
        })
    }
})

module.exports = SanUploader